<template>
    <div class="hepatitisDetail">
       <div class="top">
        <span class="vaccine">轮状病毒疫苗(五价减毒活疫苗)</span><span class="selfFunded">自费</span>
       </div>
       <div class="content">
           <div class="title">
            <p class="jin">接种时间</p>
             <p class="desc">3剂接种，分别于2、4、6月龄，首次应在6-12周龄进
                        行，随后各剂间隔4-10周。第一剂不超过12周，最晚32
                周前接种完</p>
            
           </div>
           <div class="title1">
             <p class="jin1">接种原因</p>
                        <p class="desc">轮状病毒是一种导致婴幼儿腹泻的病毒，还常伴随呕
吐和发烧.由于秋冬为高发季节，因此轮状病毒感染
也被成为“秋季腹泻”。轮状病毒既能通过消化道传
染，也能通过呼吸道传染，因此婴幼儿很易患病.接
种轮状病毒疫苗可以有效防止宝宝患病</p>
           </div>
           <div class="title2">
             <p class="jin2">接种原理</p>
                        <p class="desc">疫苗可以刺激宝宝的身体产生抗体，以预防病毒感
染.轮状病毒疫苗接种后，虽然不能达到100%预防
轮状病毒感染的效果，但是能够大大减轻感染症状，
并缩短发病时间</p>
           </div>
             
           </div>
       </div>

    
   
</template>

<script setup lang="ts">

</script>

<style scoped lang="scss">
 .hepatitisDetail{
    width: 100%;
    height: 100%;
    background: #f6f8f9;
    .top{
        width: 100%;
        height: 70px;
        background: #fff;

        .vaccine{
          line-height: 80px;
          margin-left: 20px;
          color: #f48d9e;
          font-size: 18px;
        }
        .selfFunded{
        display: inline-block;
        margin-right: 10px;
        height: 18px;
        width: 35px;
        text-align: center;
        margin-top: 14px;
        font-size: 12px;
        background: #62c0ff;
        color: #fff;
        line-height: 18px;
        margin-left: 15px;
      }
    }
    .content{
    width: 96%;
    margin-left: 10px;
    background: #fff;
    margin-top: 10px;
   
     .title{
        width: 100%;
        height: 130px;
        border-bottom: 1px solid #ccc;
       
         
        .jin{
            margin-top: 10px;
          
            height: 30px;
            line-height: 40px;
        }
        .desc{
            color:#878787;
        }
        
       p{
        height: 30px;
         margin-top: 10px;
         line-height: 25px;
       }
        
     }
      .title1{
        width: 100%;
        height: 220px;
        border-bottom: 1px solid #ccc;
    
        .jin1{
            margin-top: 10px;
          
            height: 30px;
            line-height: 40px;
        }
          .desc{
            color:#878787;
        }
        
       p{
        height: 30px;
         margin-top: 10px;
         line-height: 25px;
       }
        
     }
      .title2{
        width: 100%;
        height: 220px;
      border-bottom: 1px solid #ccc;
      
        .jin2{
            margin-top: 10px;
          
            height: 30px;
            line-height: 40px;
        }
          .desc{
            color:#878787;
        }
        
       p{
        height: 30px;
         margin-top: 10px;
         line-height: 25px;
       }
        
     }
      .title3{
        width: 100%;
        height: 150px;
      border-bottom: 1px solid #ccc;
      
        .jin2{
            margin-top: 5px;
          
            height: 30px;
            line-height: 40px;
        }
       p{
        height: 30px;
         margin-top: 5px;
         line-height: 25px;
       }
        
     }
    }
 }
</style>